<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>增加用户</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="../../../elementUI/index.css">
  <link rel="stylesheet" href="../../../css/index.css">
  <link rel="stylesheet" href="../../../component/pear/css/pear.css" />
</head>

<body>
  <div id="app" class="minWidth">
    <el-form :model="form" :rules="rules" ref="contract" inline-message="true" style="width: 100%">
      <div class="table_titel">
        <div class="titel">增加菜单</div>
      </div>
      <el-descriptions :column="1" border size="small">
        <el-descriptions-item label="菜单名称">
          <el-form-item prop="Model_Name">
            <el-input v-model.trim="form.Model_Name" placeholder="请输入菜单名称"></el-input>
          </el-form-item>
        </el-descriptions-item>
        <el-descriptions-item label="菜单等级">
          <el-form-item prop="Level">
            <el-select placeholder="请选择菜单等级" filterable v-model.trim="form.Level" @change="getMenu($event)">
              <el-option v-for="(item,index) in Level" :key="index" :label="item.label" :value="item.value"></el-option>
            </el-select>
          </el-form-item>
        </el-descriptions-item>
        <el-descriptions-item label="父级菜单">
          <el-form-item prop="Parent_Number">
            <el-select :disabled="isParent" placeholder="请选择父级菜单" clearable filterable v-model.trim="form.Parent_Number">
              <el-option v-for="item in Parent" :key="item.Model_Number" :label="item.Model_Name" :value="item.Model_Number"></el-option>
            </el-select>
          </el-form-item>
        </el-descriptions-item>
        <el-descriptions-item label="是否有子集">
          <el-form-item prop="children">
            <el-radio-group v-model="children" @change="getUrl($event)">
              <el-radio label="是" value="1"></el-radio>
              <el-radio label="否" value="0"></el-radio>
            </el-radio-group>
          </el-form-item>
        </el-descriptions-item>
        <el-descriptions-item label="菜单路由">
          <el-form-item prop="Url">
            <el-input :disabled="isUrl" v-model.trim="form.Url" placeholder="请输入菜单路由"></el-input>
          </el-form-item>
        </el-descriptions-item>
        <el-descriptions-item label="菜单图标">
          <el-form-item prop="Icon">
            <el-select placeholder="请选择菜单图标" clearable filterable v-model.trim="form.Icon">
              <el-option v-for="(item,index) in Icon" :key="index" :label="item" :value="'layui-icon '+item">
                <i class="layui-icon" :class="item"></i>
                <i>{{item}}</i>
              </el-option>
            </el-select>
            <span style="color: red;">(只一级菜单生效)</span>
          </el-form-item>
        </el-descriptions-item>
        <el-descriptions-item label="菜单配置权">
          <el-form-item prop="role">
            <el-select placeholder="请选择菜单权限" filterable v-model.trim="form.Order">
              <el-option v-for="(item,index) in Role" :key="item" :label="item.label" :value="item.value"></el-option>
            </el-select>
          </el-form-item>
        </el-descriptions-item>
      </el-descriptions>
      <div v-if="!isUrl" class="table_titel">
        <div class="titel">权限标识{{form.Children.system_model_mark.length==0?'(可添加)':''}}</div>
        <div class="operation">
          <el-button type="primary" size="small" @click="add_system_model_mark">新增</el-button>
          <el-button type="danger" size="small" @click="remove_system_model_mark">删除</el-button>
        </div>
      </div>
      <el-descriptions :column="1" border size="small" v-for="(item,index) in form.Children.system_model_mark" :key="index">
        <el-descriptions-item :label="index+1+'.标识名称'" >
          <el-form-item :prop="'Children.system_model_mark.'+index+'.Mark_Name'"
            :rules="{required: true, message: '标识不能为空', trigger: 'blur' }">
            <el-input v-model.trim="item.Mark_Name" placeholder="请输入标识名称"></el-input>
          </el-form-item>
        </el-descriptions-item> 
      </el-descriptions>
      <el-form-item class="form-operation">
        <el-button @click="window.history.back()">返回</el-button>
        <el-button type="primary" :loading="loading" @click="submitForm('contract')">提交</el-button>
      </el-form-item>
    </el-form>
  </div>
  <script type="text/javascript" src="../../../js/jquery-3.6.0.min.js"></script>
  <script type="text/javascript" src="../../../js/jquery.cookie.js"></script>
  <script type="text/javascript" src="../../../js/vue.min.js"></script>
  <script type="text/javascript" src="../../../elementUI/index.js"></script>
  <script type="text/javascript" src="../../../js/utils.js"></script>
  <script type="text/javascript" src="../../../js/ID_Validity.js"></script>
  <script type="text/javascript" src="./js/Add.js"></script>
</body>

</html>